<template>
	<view class="page_box user-list-wrap">
		<view class="head_box"></view>
		<view class="content_box">
			<label v-for="user in userDetail.dianyuan_list" :key="user.id" @tap="selStore(user.id)">
				<view class="user-item u-flex u-row-between">
					<view class="u-flex u-col-center">
						<view class="img-box">
							<image class="user-img" :src="user.avatar" mode="aspectFill" lazy-load></image>
						</view>
						<view class="item-left u-flex-col u-row-left">
							<text class="user-title">{{ user.nickname }}</text>
							<text class="user-content">历史订单：{{ user.order_count || 0 }}</text>
						</view>
					</view>

					<view class="item-left u-flex-col u-row-left" @click="onService(user.mobile)">
						<text class="user-phone">{{ user.mobile }}</text>
					</view>
				</view>
			</label>
		</view>
		<!-- <view class="foot_box u-flex u-row-between u-col-center"><button class="u-reset-button save-btn"
				@tap="saveStore">确认</button></view> -->
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				userDetail: {
					dianyuan_list: []
				}, //门店信息
				userList: [],
				userId: uni.getStorageSync('userId')
			};
		},
		computed: {},
		onLoad() {
			this.getStoreDetail();
		},
		methods: {
			// 跳转客服
			onService(phone) {
				this.$tools.callPhone(phone);
			},
			// 获取门店信息
			getStoreDetail() {
				let that = this;
				that.$http('store.info', {
					type: 'dianyuan_list',
					store_id: uni.getStorageSync('storeId')
				}).then(res => {
					if (res.code === 1) {
						that.userDetail = res.data;
						if (that.userDetail.is_dianyuan) {
							that.filterList2 = [
								// {
								// 	label: '全部',
								// 	value: 0,
								// 	parmas: 'all'
								// },
								{
									label: '待收衣',
									value: 1,
									parmas: 'put'
								},
								{
									label: '已取衣',
									value: 2,
									parmas: 'nosend'
								},
								{
									label: '待送回',
									value: 3,
									parmas: 'noget'
								},
								{
									label: '已送回',
									value: 4,
									parmas: 'finish'
								}
							];
						}
					} else {
						uni.removeStorageSync('userId');
						that.showModal = true;
					}
				});
			}
		}
	};
</script>

<style lang="scss">
	.user-item {
		margin: 18rpx 25rpx;
		padding: 30rpx 30rpx 0 30rpx;
		height: 180rpx;
		background-color: #fff;
		// border-bottom: 1rpx solid rgba(223, 223, 223, 0.6);
		width: auto;
		height: 160rpx;
		border-radius: 10rpx;
		align-items: flex-start;

		.img-box {
			width: 100rpx;
			height: 100rpx;
			border-radius: 6rpx;
			overflow: hidden;
			margin-right: 20rpx;

			.user-img {
				width: 100rpx;
				height: 100rpx;
				border-radius: 6rpx;
			}
		}

		.user-title {
			font-size: 30rpx;

			font-weight: 600;
			color: rgba(52, 52, 52, 1);
			margin-bottom: 20rpx;

			font-size: 34rpx;
			font-family: Source Han Sans CN;
			font-weight: bold;
			color: #333333;
		}

		.user-phone {
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
		}

		.user-content {
			font-size: 24rpx;

			font-weight: 400;
			color: rgba(102, 102, 102, 1);
		}
	}

	.foot_box {
		height: 100rpx;
		background: rgba(255, 255, 255, 1);
		padding: 0 20rpx;

		.save-btn {
			width: 710rpx;
			line-height: 80rpx;
			background: linear-gradient(90deg, #0099E5, #0099E5);
			border: 1rpx solid rgba(238, 238, 238, 1);
			font-size: 30rpx;

			font-weight: 500;
			color: rgba(255, 255, 255, 1);
			padding: 0;
			border-radius: 40rpx;
		}
	}
</style>